<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>在QML中拖动无边框窗口时“抖动”的问题 | 麻菜的博客 - 学无止尽，专研先进技术</title>
    <meta name="description" content="c++,Qt5,QML,Qt Quick,Web,3DSMax,Unreal Engine 4等技术的开发,以及生物化学,粒子物理,核物理,量子力学,光学,热学,声学等科学理论知识学习研究">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
  <link rel="shortcut icon" href="/favicon.ico">
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons">
    
    <link rel="preload" href="/assets/css/0.styles.120c5b57.css" as="style"><link rel="preload" href="/assets/js/app.8f4a866c.js" as="script"><link rel="preload" href="/assets/js/24.00753ba1.js" as="script"><link rel="preload" href="/assets/js/2.e64af106.js" as="script"><link rel="preload" href="/assets/js/7.126eaad1.js" as="script"><link rel="preload" href="/assets/js/6.2b31397e.js" as="script"><link rel="preload" href="/assets/js/8.0b1783e5.js" as="script"><link rel="preload" href="/assets/js/17.24005194.js" as="script"><link rel="preload" href="/assets/js/13.c599d64e.js" as="script"><link rel="preload" href="/assets/js/28.8756cadc.js" as="script"><link rel="preload" href="/assets/js/11.6049ec15.js" as="script"><link rel="preload" href="/assets/js/4.b8ad457b.js" as="script"><link rel="preload" href="/assets/js/3.a1845274.js" as="script"><link rel="prefetch" href="/assets/js/1.d1d98b20.js"><link rel="prefetch" href="/assets/js/10.c41e85c0.js"><link rel="prefetch" href="/assets/js/12.6da0e6a2.js"><link rel="prefetch" href="/assets/js/14.70ac617f.js"><link rel="prefetch" href="/assets/js/16.b61a00eb.js"><link rel="prefetch" href="/assets/js/18.277ce043.js"><link rel="prefetch" href="/assets/js/19.451c405c.js"><link rel="prefetch" href="/assets/js/20.72754453.js"><link rel="prefetch" href="/assets/js/21.d2bb4227.js"><link rel="prefetch" href="/assets/js/22.354a8a4c.js"><link rel="prefetch" href="/assets/js/23.0b690dd8.js"><link rel="prefetch" href="/assets/js/25.4e0e6363.js"><link rel="prefetch" href="/assets/js/26.6a6acc25.js"><link rel="prefetch" href="/assets/js/27.8b49a6b1.js"><link rel="prefetch" href="/assets/js/29.c4db8372.js"><link rel="prefetch" href="/assets/js/30.326675bc.js"><link rel="prefetch" href="/assets/js/31.be65646e.js"><link rel="prefetch" href="/assets/js/32.16a23967.js"><link rel="prefetch" href="/assets/js/33.83c9a5cd.js"><link rel="prefetch" href="/assets/js/34.82dc9af6.js"><link rel="prefetch" href="/assets/js/35.cce1e5f4.js"><link rel="prefetch" href="/assets/js/36.a3d916ad.js"><link rel="prefetch" href="/assets/js/37.cec4c776.js"><link rel="prefetch" href="/assets/js/38.214bbaa6.js"><link rel="prefetch" href="/assets/js/5.8065acb2.js"><link rel="prefetch" href="/assets/js/9.5d2f5521.js">
    <link rel="stylesheet" href="/assets/css/0.styles.120c5b57.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div data-app="true" id="app" class="v-application v-application--is-ltr theme--light" data-v-226a0c77><div class="v-application--wrap"><header class="v-sheet v-sheet--tile theme--dark v-toolbar v-app-bar v-app-bar--clipped v-app-bar--fixed primary" style="height:64px;margin-top:0px;transform:translateY(0px);left:0px;right:0px;" data-v-57ca87a5 data-v-226a0c77><div class="v-toolbar__content" style="height:64px;"><button type="button" class="v-app-bar__nav-icon v-btn v-btn--flat v-btn--icon v-btn--round theme--dark v-size--default" data-v-57ca87a5><span class="v-btn__content"><i aria-hidden="true" class="v-icon notranslate mdi mdi-menu theme--dark" data-v-57ca87a5></i></span></button> <a href="/" class="router-link-active" data-v-0bc96f30 data-v-57ca87a5><button type="button" class="white--text title hidden-sm-and-down v-btn v-btn--flat v-btn--text theme--dark v-size--x-large" data-v-0bc96f30><span class="v-btn__content">麻菜的博客</span></button></a> <div class="spacer" data-v-57ca87a5></div> <div class="v-responsive mr-0 mr-md-6 hidden-xs-only" style="max-width:300px;" data-v-0147d7ba data-v-57ca87a5><div class="v-responsive__content"><div class="v-menu" data-v-0147d7ba><div class="v-input hidden-sm-and-down v-input--hide-details theme--dark v-text-field v-text-field--single-line v-text-field--solo v-text-field--solo-inverted v-text-field--solo-flat v-text-field--enclosed" data-v-0147d7ba><div class="v-input__control"><div class="v-input__slot"><div class="v-input__prepend-inner"><div class="v-input__icon v-input__icon--prepend-inner"><i aria-hidden="true" class="v-icon notranslate mdi mdi-magnify theme--dark"></i></div></div><div class="v-text-field__slot"><label for="search" class="v-label theme--dark" style="left:0px;right:auto;position:absolute;">搜索(按 &quot;/&quot; 键激活)</label><input autocomplete="off" id="search" type="text" value=""></div></div></div></div><div data-v-0147d7ba="" role="menu" class="v-menu__content theme--light " style="max-height:auto;min-width:0px;max-width:auto;top:12px;left:0px;transform-origin:top left;z-index:0;display:none;"></div></div></div></div> <a href="/" class="v-btn v-btn--flat v-btn--router v-btn--text theme--dark v-size--default" data-v-57ca87a5><span class="v-btn__content">首页</span></a> <div class="v-menu" data-v-59452aff data-v-57ca87a5><button type="button" class="v-btn v-btn--flat v-btn--text theme--dark v-size--default" data-v-59452aff><span class="v-btn__content">
            快速导航
            <i aria-hidden="true" class="v-icon notranslate v-icon--right mdi mdi-menu-down theme--dark" data-v-59452aff></i></span></button><div data-v-59452aff="" role="menu" class="v-menu__content theme--light " style="max-height:calc(100% - 16px);min-width:0px;max-width:auto;top:12px;left:12px;transform-origin:top left;z-index:0;display:none;"></div></div> <a href="https://github.com/yuriyoung" target="_blank" class="text-capitalize v-btn v-btn--flat v-btn--text theme--dark v-size--default" data-v-57ca87a5><span class="v-btn__content">
        GitHub<i aria-hidden="true" class="v-icon notranslate v-icon--right mdi mdi-open-in-new theme--dark" style="font-size:16px;" data-v-57ca87a5></i></span></a></div></header> <div class="pb-12" data-v-4d73078d data-v-226a0c77><nav class="v-navigation-drawer v-navigation-drawer--close v-navigation-drawer--fixed v-navigation-drawer--is-mobile theme--light" style="height:100vh;top:0px;transform:translateX(-100%);width:380px;" data-v-75e69a68 data-v-4d73078d><div class="v-navigation-drawer__prepend"><header class="v-sheet v-sheet--tile theme--light v-toolbar v-toolbar--dense v-toolbar--flat" style="height:48px;" data-v-4d73078d><div class="v-toolbar__content" style="height:48px;"><a href="/" class="v-btn v-btn--flat v-btn--icon v-btn--round v-btn--router theme--light v-size--small" data-v-4d73078d><span class="v-btn__content"><i aria-hidden="true" class="v-icon notranslate mdi mdi-arrow-left-bold-outline theme--light" data-v-4d73078d></i></span></a> <span class="grey--text subtitle-2" data-v-4d73078d>返回</span> <div class="spacer" data-v-4d73078d></div></div></header> <hr role="separator" aria-orientation="horizontal" class="v-divider theme--light" data-v-75e69a68></div><div class="v-navigation-drawer__content">   <div class="v-list v-sheet v-sheet--tile theme--light v-list--two-line" data-v-7a9bafc5 data-v-4d73078d><div role="listbox" class="v-item-group theme--light v-list-item-group primary--text" data-v-7a9bafc5><a href="/articles/qml/" tabindex="0" class="v-list-item v-list-item--link v-list-item--selectable theme--light" data-v-7a9bafc5><div class="v-list-item__content" data-v-7a9bafc5><div class="v-list-item__title" data-v-7a9bafc5>QML</div> <div class="v-list-item__subtitle" data-v-7a9bafc5></div></div></a><a href="/articles/qml/qml-hot-reload.html" tabindex="0" class="v-list-item v-list-item--link v-list-item--selectable theme--light" data-v-7a9bafc5><div class="v-list-item__content" data-v-7a9bafc5><div class="v-list-item__title" data-v-7a9bafc5>QML热加载精简实现方法</div> <div class="v-list-item__subtitle" data-v-7a9bafc5></div></div></a><a href="/articles/qml/vacuum-command-rebuilds-the-sqlite-database-file.html" tabindex="0" class="v-list-item v-list-item--link v-list-item--selectable theme--light" data-v-7a9bafc5><div class="v-list-item__content" data-v-7a9bafc5><div class="v-list-item__title" data-v-7a9bafc5>使用vacuum命令重建Sqlite数据库文件空间列表</div> <div class="v-list-item__subtitle" data-v-7a9bafc5></div></div></a><a href="/articles/qml/dragging-frameless-window-jiggles-in-qml.html" tabindex="0" class="v-item--active v-list-item--active v-list-item v-list-item--link v-list-item--selectable theme--light" data-v-7a9bafc5><div class="v-list-item__content" data-v-7a9bafc5><div class="v-list-item__title" data-v-7a9bafc5>在QML中拖动无边框窗口时“抖动”的问题</div> <div class="v-list-item__subtitle" data-v-7a9bafc5>在某些系统(linux)会出现</div></div></a><a href="/articles/qml/resizable-borders-of-Rectangle-to-selection-rect-for-crop-image.html" tabindex="0" class="v-list-item v-list-item--link v-list-item--selectable theme--light" data-v-7a9bafc5><div class="v-list-item__content" data-v-7a9bafc5><div class="v-list-item__title" data-v-7a9bafc5>实现图像区域选择并裁剪 (1)</div> <div class="v-list-item__subtitle" data-v-7a9bafc5>可自由缩放Rectangle边，拖拽选择范围</div></div></a><a href="/articles/qml/image-area-selection-and-crop-in-qml.html" tabindex="0" class="v-list-item v-list-item--link v-list-item--selectable theme--light" data-v-7a9bafc5><div class="v-list-item__content" data-v-7a9bafc5><div class="v-list-item__title" data-v-7a9bafc5>实现图像区域选择并裁剪 (2)</div> <div class="v-list-item__subtitle" data-v-7a9bafc5>QML中可自由缩放和拖拽的Rectangle,要求C++</div></div></a><a href="/articles/qml/dragging-jiggles.html" tabindex="0" class="v-list-item v-list-item--link v-list-item--selectable theme--light" data-v-7a9bafc5><div class="v-list-item__content" data-v-7a9bafc5><div class="v-list-item__title" data-v-7a9bafc5>无边框窗口拖动“抖动”解决方法</div> <div class="v-list-item__subtitle" data-v-7a9bafc5>在QML中拖动无边框窗口时“抖动”的普通实现</div></div></a></div></div> <hr role="separator" aria-orientation="horizontal" class="v-divider theme--light" data-v-75e69a68></div><div class="v-navigation-drawer__append"><hr role="separator" aria-orientation="horizontal" class="v-divider theme--light" data-v-75e69a68> </div><div class="v-navigation-drawer__border"></div></nav> <main class="v-content" style="padding-top:64px;padding-right:0px;padding-bottom:0px;padding-left:0px;" data-v-4d73078d><div class="v-content__wrap"><div class="v-responsive mx-auto overflow-visible" style="max-width:1024px;" data-v-4d73078d><div class="v-responsive__content"><div class="container" data-v-4d73078d><div class="v-responsive overflow-visible" style="min-height:90vh;" data-v-4d73078d><div class="v-responsive__content"><div data-v-4d73078d><header class="v-sheet v-sheet--tile theme--light v-toolbar v-toolbar--flat" style="height:64px;"><div class="v-toolbar__content" style="height:64px;"><div class="v-toolbar__title">
            在QML中拖动无边框窗口时“抖动”的问题
        </div></div></header> <div class="pb-6"></div> <div class="content__default"><h2 id="一般实现"><a href="#一般实现" class="header-anchor">#</a> 一般实现</h2> <p>通常拖动的实现方法如下，会导致在某些系统上窗口“抖动”：</p> <div class="language-js line-numbers-mode"><pre class="language-js"><code>    ApplicationWindow <span class="token punctuation">{</span>
    id<span class="token punctuation">:</span> mainWindow
    visible<span class="token punctuation">:</span> <span class="token boolean">true</span>
    width<span class="token punctuation">:</span> <span class="token number">640</span>
    height<span class="token punctuation">:</span> <span class="token number">480</span>
    title<span class="token punctuation">:</span> <span class="token function">qsTr</span><span class="token punctuation">(</span><span class="token string">&quot;Window&quot;</span><span class="token punctuation">)</span>
    flags<span class="token punctuation">:</span> Qt<span class="token punctuation">.</span>FramelessWindowHint
    header<span class="token punctuation">:</span> ToolBar <span class="token punctuation">{</span>
        MouseArea<span class="token punctuation">{</span>
            anchors<span class="token punctuation">.</span>fill<span class="token punctuation">:</span> parent
            property variant pressedPos<span class="token punctuation">:</span> <span class="token string">&quot;0,0&quot;</span>

            onPressed<span class="token punctuation">:</span> <span class="token punctuation">{</span>
                pressedPos  <span class="token operator">=</span> Qt<span class="token punctuation">.</span><span class="token function">point</span><span class="token punctuation">(</span>mouse<span class="token punctuation">.</span>x<span class="token punctuation">,</span> mouse<span class="token punctuation">.</span>y<span class="token punctuation">)</span>
            <span class="token punctuation">}</span>

            onPositionChanged<span class="token punctuation">:</span> <span class="token punctuation">{</span>
                    <span class="token keyword">var</span> delta <span class="token operator">=</span> Qt<span class="token punctuation">.</span><span class="token function">point</span><span class="token punctuation">(</span>mouse<span class="token punctuation">.</span>x <span class="token operator">-</span> pressedPos<span class="token punctuation">.</span>x<span class="token punctuation">,</span> mouse<span class="token punctuation">.</span>y <span class="token operator">-</span> pressedPos<span class="token punctuation">.</span>y<span class="token punctuation">)</span><span class="token punctuation">;</span>
                    mainWindow<span class="token punctuation">.</span>x <span class="token operator">+=</span> delta<span class="token punctuation">.</span>x<span class="token punctuation">;</span>
                    mainWindow<span class="token punctuation">.</span>y <span class="token operator">+=</span> delta<span class="token punctuation">.</span>y<span class="token punctuation">;</span>
            <span class="token punctuation">}</span>
        <span class="token punctuation">}</span>
    <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div><h2 id="解决方法1："><a href="#解决方法1：" class="header-anchor">#</a> 解决方法1：</h2> <p>使用c++实现一个鼠标位置的帮助类，并将其对象暴露给QML上下文属性，来解决这个问题。这个方法在原先“抖动”的系统上，使得复杂的QML UI也能表现良好：</p> <ol><li>一个c++帮助类的实现：</li></ol> <div class="language-cpp line-numbers-mode"><pre class="language-cpp"><code><span class="token keyword">class</span> <span class="token class-name">CursorPosProvider</span> <span class="token operator">:</span> <span class="token keyword">public</span> QObject
<span class="token punctuation">{</span>
    Q_OBJECT
<span class="token keyword">public</span><span class="token operator">:</span>
    <span class="token keyword">explicit</span> <span class="token function">CursorPosProvider</span><span class="token punctuation">(</span>QObject <span class="token operator">*</span>parent <span class="token operator">=</span> <span class="token keyword">nullptr</span><span class="token punctuation">)</span> <span class="token operator">:</span> <span class="token function">QObject</span><span class="token punctuation">(</span>parent<span class="token punctuation">)</span>
    <span class="token punctuation">{</span>
    <span class="token punctuation">}</span>
    <span class="token keyword">virtual</span> <span class="token operator">~</span><span class="token function">CursorPosProvider</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span> <span class="token keyword">default</span><span class="token punctuation">;</span>

    Q_INVOKABLE QPointF <span class="token function">cursorPos</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
    <span class="token punctuation">{</span>
        <span class="token keyword">return</span> QCursor<span class="token operator">::</span><span class="token function">pos</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">;</span>
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br></div></div><p>非常简单的一个类，只从c++端提供一个鼠标位置。这有些奇怪，在QML中使用相同的操作时，在一些系统上会遇到“抖动”问题。</p> <ol start="2"><li>将这个类注册为context属性暴露给QML：</li></ol> <div class="language-cpp line-numbers-mode"><pre class="language-cpp"><code><span class="token comment">// ...</span>
<span class="token macro property">#<span class="token directive keyword">include</span> <span class="token string">&quot;CursorPosProvider.h&quot;</span></span>

<span class="token keyword">int</span> <span class="token function">main</span><span class="token punctuation">(</span><span class="token keyword">int</span> argc<span class="token punctuation">,</span> <span class="token keyword">char</span> <span class="token operator">*</span>argv<span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span>
<span class="token punctuation">{</span>
    QGuiApplication <span class="token function">app</span><span class="token punctuation">(</span>argc<span class="token punctuation">,</span> argv<span class="token punctuation">)</span><span class="token punctuation">;</span>

    CursorPosProvider mousePosProvider<span class="token punctuation">;</span> 
    QQmlApplicationEngine engine<span class="token punctuation">;</span>
    engine<span class="token punctuation">.</span><span class="token function">rootContext</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">-&gt;</span><span class="token function">setContextProperty</span><span class="token punctuation">(</span><span class="token string">&quot;mousePosition&quot;</span><span class="token punctuation">,</span> <span class="token operator">&amp;</span>mousePosProvider<span class="token punctuation">)</span><span class="token punctuation">;</span>
    engine<span class="token punctuation">.</span><span class="token function">load</span><span class="token punctuation">(</span><span class="token function">QUrl</span><span class="token punctuation">(</span><span class="token function">QStringLiteral</span><span class="token punctuation">(</span><span class="token string">&quot;qrc:/main.qml&quot;</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

    <span class="token keyword">return</span> app<span class="token punctuation">.</span><span class="token function">exec</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br></div></div><ol start="3"><li>给无边框窗口实现一个Qt Quick标题栏组件<code>TitleBar.qml</code>：</li></ol> <div class="language-js line-numbers-mode"><pre class="language-js"><code>Rectangle <span class="token punctuation">{</span>
    id<span class="token punctuation">:</span> control
    width<span class="token punctuation">:</span> parent<span class="token punctuation">.</span>width
    color<span class="token punctuation">:</span> <span class="token string">&quot;#2196F3&quot;</span> <span class="token comment">// 随便给的一个颜色</span>

    property QtObject container
    <span class="token comment">// TODO: 一些扩展属性或信号</span>
    <span class="token comment">// ...</span>

    MouseArea <span class="token punctuation">{</span>
        id<span class="token punctuation">:</span> titleBarMouseRegion
        property <span class="token keyword">var</span> pressedPos
        anchors<span class="token punctuation">.</span>fill<span class="token punctuation">:</span> parent
        onPressed<span class="token punctuation">:</span> <span class="token punctuation">{</span>
            pressedPos <span class="token operator">=</span> <span class="token punctuation">{</span> x<span class="token punctuation">:</span> mouse<span class="token punctuation">.</span>x<span class="token punctuation">,</span> y<span class="token punctuation">:</span> mouse<span class="token punctuation">.</span>y <span class="token punctuation">}</span>
        <span class="token punctuation">}</span>
        onPositionChanged<span class="token punctuation">:</span> <span class="token punctuation">{</span>
            container<span class="token punctuation">.</span>x <span class="token operator">=</span> mousePosition<span class="token punctuation">.</span><span class="token function">cursorPos</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span>x <span class="token operator">-</span> pressedPos<span class="token punctuation">.</span>x
            container<span class="token punctuation">.</span>y <span class="token operator">=</span> mousePosition<span class="token punctuation">.</span><span class="token function">cursorPos</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span>y <span class="token operator">-</span> pressedPos<span class="token punctuation">.</span>y
        <span class="token punctuation">}</span>
    <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div><p>4.现在可以在Window组件下使用这个TitleBar组件了：</p> <div class="language-js line-numbers-mode"><pre class="language-js"><code>Window <span class="token punctuation">{</span>
    id<span class="token punctuation">:</span> root
    visible<span class="token punctuation">:</span> <span class="token boolean">true</span>
    flags<span class="token punctuation">:</span> Qt<span class="token punctuation">.</span>FramelessWindowHint

    TitleBar <span class="token punctuation">{</span>
        height<span class="token punctuation">:</span> <span class="token number">20</span>
        container<span class="token punctuation">:</span> root
    <span class="token punctuation">}</span>

    Text <span class="token punctuation">{</span>
        text<span class="token punctuation">:</span> <span class="token function">qsTr</span><span class="token punctuation">(</span><span class="token string">&quot;Hello World&quot;</span><span class="token punctuation">)</span>
        anchors<span class="token punctuation">.</span>centerIn<span class="token punctuation">:</span> parent
    <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br></div></div><p>补充：当使用无边框窗口拖动时，UI中的动画会停止刷新（在Mac OS，其他系统未测试），直到拖动被释放，此时拖动过程中的动画侦被跳过了。而拖动原生窗口的标题栏不会导致这种问题。所以，有必要提出<code>解决方法2</code>。</p> <h2 id="解决方法2："><a href="#解决方法2：" class="header-anchor">#</a> 解决方法2：</h2> <p>使用系统API（待续...）</p></div> <!----></div></div></div></div></div></div></div></main></div> <main class="v-content" style="padding-top:64px;padding-right:0px;padding-bottom:0px;padding-left:0px;" data-v-a20e1186 data-v-226a0c77><div class="v-content__wrap"><hr role="separator" aria-orientation="horizontal" class="v-divider theme--light" data-v-a20e1186> <footer class="v-footer v-sheet v-sheet--tile theme--light" data-v-a20e1186><div class="container" data-v-abe47414 data-v-abe47414 data-v-a20e1186><div class="text-center grey--text subtitle-2" data-v-abe47414>友情链接</div> <div class="col col-12" data-v-abe47414 data-v-abe47414><div class="row align-center justify-center" data-v-abe47414 data-v-abe47414><span class="v-tooltip v-tooltip--top" data-v-abe47414><div data-v-abe47414="" class="v-tooltip__content" style="left:0px;max-width:auto;opacity:0;top:12px;z-index:0;display:none;"></div><a href="https://jaredtao.github.io" target="_blank" draggable="false" dense="" class="ma-2 v-chip v-chip--clickable v-chip--link theme--dark v-size--default teal" data-v-abe47414><span class="v-chip__content"><div class="v-avatar v-avatar--left" style="height:48px;min-width:48px;width:48px;" data-v-abe47414><div class="v-responsive v-image" data-v-abe47414><div class="v-image__image v-image__image--preload v-image__image--cover" style="background-image:;background-position:center center;"></div><div class="v-responsive__content"></div></div></div>
                            涛哥的博客
                            <i aria-hidden="true" class="v-icon notranslate v-icon--right mdi mdi-open-in-new theme--dark" style="font-size:12px;" data-v-abe47414></i></span></a></span><span class="v-tooltip v-tooltip--top" data-v-abe47414><div data-v-abe47414="" class="v-tooltip__content" style="left:0px;max-width:auto;opacity:0;top:12px;z-index:0;display:none;"></div><a href="https://zhuanlan.zhihu.com/TaoQt" target="_blank" draggable="false" dense="" class="ma-2 v-chip v-chip--clickable v-chip--link theme--dark v-size--default teal" data-v-abe47414><span class="v-chip__content"><div class="v-avatar v-avatar--left" style="height:48px;min-width:48px;width:48px;" data-v-abe47414><div class="v-responsive v-image" data-v-abe47414><div class="v-image__image v-image__image--preload v-image__image--cover" style="background-image:;background-position:center center;"></div><div class="v-responsive__content"></div></div></div>
                            Qt进阶之路
                            <i aria-hidden="true" class="v-icon notranslate v-icon--right mdi mdi-open-in-new theme--dark" style="font-size:12px;" data-v-abe47414></i></span></a></span><span class="v-tooltip v-tooltip--top" data-v-abe47414><div data-v-abe47414="" class="v-tooltip__content" style="left:0px;max-width:auto;opacity:0;top:12px;z-index:0;display:none;"></div><a href="https://qtdream.com" target="_blank" draggable="false" dense="" class="ma-2 v-chip v-chip--clickable v-chip--link theme--dark v-size--default teal" data-v-abe47414><span class="v-chip__content"><div class="v-avatar v-avatar--left" style="height:48px;min-width:48px;width:48px;" data-v-abe47414><div class="v-responsive v-image" data-v-abe47414><div class="v-image__image v-image__image--preload v-image__image--cover" style="background-image:;background-position:center center;"></div><div class="v-responsive__content"></div></div></div>
                            萌梦论坛
                            <i aria-hidden="true" class="v-icon notranslate v-icon--right mdi mdi-open-in-new theme--dark" style="font-size:12px;" data-v-abe47414></i></span></a></span><span class="v-tooltip v-tooltip--top" data-v-abe47414><div data-v-abe47414="" class="v-tooltip__content" style="left:0px;max-width:auto;opacity:0;top:12px;z-index:0;display:none;"></div><a href="https://www.heilqt.com" target="_blank" draggable="false" dense="" class="ma-2 v-chip v-chip--clickable v-chip--link theme--dark v-size--default teal" data-v-abe47414><span class="v-chip__content"><div class="v-avatar v-avatar--left" style="height:48px;min-width:48px;width:48px;" data-v-abe47414><div class="v-responsive v-image" data-v-abe47414><div class="v-image__image v-image__image--preload v-image__image--cover" style="background-image:;background-position:center center;"></div><div class="v-responsive__content"></div></div></div>
                            寒山-居士的博客
                            <i aria-hidden="true" class="v-icon notranslate v-icon--right mdi mdi-open-in-new theme--dark" style="font-size:12px;" data-v-abe47414></i></span></a></span><span class="v-tooltip v-tooltip--top" data-v-abe47414><div data-v-abe47414="" class="v-tooltip__content" style="left:0px;max-width:auto;opacity:0;top:12px;z-index:0;display:none;"></div><a href="http://www.cryfeifei.cn" target="_blank" draggable="false" dense="" class="ma-2 v-chip v-chip--clickable v-chip--link theme--dark v-size--default teal" data-v-abe47414><span class="v-chip__content"><div class="v-avatar v-avatar--left" style="height:48px;min-width:48px;width:48px;" data-v-abe47414><div class="v-responsive v-image" data-v-abe47414><div class="v-image__image v-image__image--preload v-image__image--cover" style="background-image:;background-position:center center;"></div><div class="v-responsive__content"></div></div></div>
                            张小飞的博客
                            <i aria-hidden="true" class="v-icon notranslate v-icon--right mdi mdi-open-in-new theme--dark" style="font-size:12px;" data-v-abe47414></i></span></a></span></div></div></div> <div class="text-center col col-12" data-v-a20e1186><span data-v-a20e1186>© 2019 — <strong data-v-a20e1186>Yuri Young</strong></span> <a href="https://github.com/yuriyoung" target="_blank" class="v-btn v-btn--flat v-btn--icon v-btn--round theme--light v-size--small" data-v-a20e1186><span class="v-btn__content"><i aria-hidden="true" class="v-icon notranslate mdi mdi-github-circle theme--light" data-v-a20e1186></i></span></a></div></footer></div></main> <button type="button" title="Scroll to top" aria-label="Scroll to top" class="v-btn v-btn--bottom v-btn--contained v-btn--fab v-btn--fixed v-btn--right v-btn--round theme--dark v-size--default pink" style="display:none;" data-v-0daec80c data-v-0daec80c data-v-226a0c77><span class="v-btn__content"><i aria-hidden="true" class="v-icon notranslate mdi mdi-chevron-up theme--dark" data-v-0daec80c></i></span></button></div></div><div class="global-ui"></div></div>
    <script src="/assets/js/app.8f4a866c.js" defer></script><script src="/assets/js/24.00753ba1.js" defer></script><script src="/assets/js/2.e64af106.js" defer></script><script src="/assets/js/7.126eaad1.js" defer></script><script src="/assets/js/6.2b31397e.js" defer></script><script src="/assets/js/8.0b1783e5.js" defer></script><script src="/assets/js/17.24005194.js" defer></script><script src="/assets/js/13.c599d64e.js" defer></script><script src="/assets/js/28.8756cadc.js" defer></script><script src="/assets/js/11.6049ec15.js" defer></script><script src="/assets/js/4.b8ad457b.js" defer></script><script src="/assets/js/3.a1845274.js" defer></script>
    <script>
      var _hmt = _hmt || [];
      (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?67cfceeef119a8accf51c7c87e0fa067";
        var s = document.getElementsByTagName("script")[0]; 
        s.parentNode.insertBefore(hm, s);
      })();

      (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?3dd88b8a3279675ebd83ecae11016bc1";
        var s = document.getElementsByTagName("script")[0]; 
        s.parentNode.insertBefore(hm, s);
      })();
    </script>
  </body>
</html>
